import React, { Component } from 'react';
import { StyleSheet, Text, View, Image, ScrollView, TouchableOpacity, Dimensions, TextInput, Modal, ActivityIndicator } from "react-native";
import { style } from '../../theme/style';
import { Common } from '../../component/common/Common';

const ScreenWidth = Dimensions.get('window').width;
const scale = ScreenWidth / 375;
var Password1 = '';
export class safeSetting extends Component {
  static navigationOptions = ({ navigation }) => {
    return {
      title: '安全设置',
      headerTintColor: style.color.white,
      headerLeft: <Common type="headLeft" onPress={() => { navigation.goBack() }} color='#fff' />,
      headerRight: (<Image style={{ marginLeft: 18 * scale, width: 9 * scale, height: 16 * scale }} source={require('../../imgs/goBackEmpty.png')} />),
      headerStyle: {
        elevation: 0,
        backgroundColor: style.color.themeColor,
      },
      headerTitleStyle: {
        flex: 1,
        textAlign: 'center'
      }
    }
  }

  constructor(props) {
    super(props);
    this.state = {
    };
  }

  render () {
    return (
      <View style={styles.listBox}>
        <TouchableOpacity style={styles.list} onPress={() => { this.props.navigation.navigate('SetUpPage') }} activeOpacity={1} >
						<Text style={styles.listLeft}>指纹解锁</Text>
						<View style={styles.listRight}>
							<Image style={styles.listRightImg} source={require('../../imgs/arrow-left.png')} />
						</View>
					</TouchableOpacity>
          <TouchableOpacity style={styles.list} onPress={() => { this.props.navigation.navigate('gesturePassword') }} activeOpacity={1} >
						<Text style={styles.listLeft}>手势解锁</Text>
						<View style={styles.listRight}>
							<Image style={styles.listRightImg} source={require('../../imgs/arrow-left.png')} />
						</View>
					</TouchableOpacity>
      </View>   
    )
  }
}


const styles = StyleSheet.create({
  listBox: {
		backgroundColor: '#fff',
		paddingLeft: 15 * scale,
		paddingRight: 15 * scale
	},
  list: {
		flexDirection: 'row',
		justifyContent: 'space-between',
		alignItems: 'center',
		borderBottomWidth: 1,
		borderStyle: 'solid',
		borderBottomColor: style.color.border,
		height: 52 * scale,
		width: '100%',
	},
	listActive: {
		borderBottomWidth: 0,
	},
	listLeft: {
		fontSize: 14 * scale,
		color: style.color.dark
	},
	listRight: {
		flexDirection: 'row',
		justifyContent: 'space-between',
		alignItems: 'center'
	},
	listRightText: {
		fontSize: 14 * scale,
		color: style.color.themeColor,
		marginRight: 8 * scale,
	},
	listRightImg: {
		width: 6 * scale,
		height: 11 * scale,
	},
})